<!-- todo 提示优化   <el-table-column type="selection" width="55"></el-table-column>-->
<template>
	<public-dialog v-model="dialogTableVisible" @confirmDialog="doSubmit" :beforeClose="closeDialog" title="冻结列选取">
		<el-table :data="gridData" ref="multipleTableRef" style="width: 100%" @selection-change="handleSelectionChange">
			<el-table-column type="selection" width="55"></el-table-column>
			<el-table-column property="label" label="列名" show-overflow-tooltip />
		</el-table>
	</public-dialog>
</template>

<script setup>
import { ref, watch, onMounted, getCurrentInstance, nextTick } from "vue";
import "../style/pubTablecss.scss";
let { proxy } = getCurrentInstance();
//props
const props = defineProps({
	//是否显示
	tableData: {
		type: Object,
		default: {},
	},
});

const handleSelectionChange = (e) => {
	//   console.log(789, e);
};

const gridData = ref([]);
var multipleTableRef = ref();

const dialogTableVisible = ref(false);
const emits = defineEmits(["closeFixeDialog", "changeTabelData"]);
const closeDialog = () => {
	emits("closeFixeDialog");
};
const doSubmit = (type) => {
	console.log("触发1", type);
	if (type === "cancel") {
		emits("closeFixeDialog");
		return;
	}else if(type === "confirm"){

		emitFixNow();
	}else{
		// if(dialogTableVisible.value){
		// 	dialogTableVisible.value = false;
		// }
	}
};

const emitFixNow = () => {
	// let clumsObj = JSON.parse(JSON.stringify(props.tableData.clums));
	let clumsObj = props.tableData.clums;
	let checkedRow = multipleTableRef.value.getSelectionRows();
	console.log("clumsObj", clumsObj, "checkedRow", checkedRow);
	clumsObj.forEach((item) => {
		if (item.props && item.fixed != "right") {
			if (checkedRow.filter((check) => check.props == item.props).length > 0) {
				item["fixed"] = "left";
			} else {
				delete item["fixed"];
			}
		}
	});
	//   console.log("result", clumsObj);

	emits("changeTabelData", clumsObj);
};

const loadSelect = async () => {
	await nextTick();
	if (multipleTableRef.value) {
		gridData.value.forEach((item) => {
			if (item.fixed === "left" || item.fixed === true) {
				/*        todo传入空列表是否会报错 */
				//   console.log('multipleTableRef.value', multipleTableRef.value);
				multipleTableRef.value.toggleRowSelection(item);
			}
		});
	}

	console.log("props.tableData.clums", props.tableData.clums);
};

onMounted(() => {
	if (props.tableData) {
		dialogTableVisible.value = true;
		gridData.value = props.tableData.clums.filter((item) => item.props && item.fixed != "right");

		loadSelect();
	} else {
	}
});
</script>

<style lang="scss" scoped></style>
